<template>
    <div id="Apply">
        <body-container>
            <search-form-container @search="onSearch">
                <vj-form hide-foot :form-data.sync="searchForm" inline :cfg-list="searchCfg"/>
                <vj-form hide-foot :slot-idx="subSearchCfg.length" :form-data.sync="searchForm" inline
                         :cfg-list="subSearchCfg">
                    <el-button slot="form-item">导出Excel</el-button>
                </vj-form>
                <el-form>
                    <el-form-item label="导入报名名单：">
                       <div style="display: flex">
                           <vj-file/>
                           <el-button style="margin: 0 20px">确定导入</el-button>
                           <p style="color: red"> 注：上传报名名单前请选择对应的活动</p>
                       </div>
                    </el-form-item>
                </el-form>
            </search-form-container>
            <vj-table :page-obj="pageObj" @loadTable="onSearch" :loading="loading" :cfg-list="cfgList"
                      :table-data="tableData">
                <template #action="{id}">
                    <text-button text="编辑" @click="$pushRoute({path:'edit',query:{id}})"/>
                </template>
            </vj-table>
        </body-container>
    </div>
</template>
<script lang="ts">
    import Vue, {ComponentOptions, VueConstructor} from "vue"
    import Component from 'vue-class-component'
    import BodyContainer from "@/components/layout/body-container.vue";
    import SearchFormContainer from "@/components/layout/search-form-conatiner.vue";
    import {Mixins, Ref} from "vue-property-decorator";
    import {TableMixin} from "@/plugins/mixins/table";
    import {requestByGet, requestByPost} from "@/utils/request";
    import {formatOptions, groupBy, hookLoading, itemFromArr, updateCfgOption} from "vijay-util";
    import TextButton from "@/components/basic/text-button.vue";
    import {ActivityApplyTB, PuzzleRecordTB} from "@/config/table";
    import {ActivityApplySH, ActivityApplySubSH, PuzzleRecordSH} from "@/config/search";

    export const title = "报名列表";
    @Component({
        components: {TextButton, SearchFormContainer, BodyContainer}
    })
    export default class PuzzleRecord extends Mixins(TableMixin) implements ComponentOptions<Vue> {
        name = "Apply"
        cfgList = ActivityApplyTB;
        searchCfg = ActivityApplySH;
        subSearchCfg = ActivityApplySubSH;
        @hookLoading()
        async onSearch(pageNo?, pageSize?) {
            const params = Object.assign({pageNo,pageSize}, this.selectForm, this.searchForm);
            const res = await requestByGet(`qqc/qqcActsign/list`, params);
            this.tableData = res.records;
            return res;
        }
        created() {
            this.onSearch();
        }
    }
</script>

<style scoped lang="scss">
    @import "~assets/common.scss";
    @import "~assets/scss/variables.scss";
    #Apply {
    }
</style>
